import React from 'react'
import { useSelector, useDispatch } from "react-redux"
import { getMovieAction } from "../../store/slice/movieSlice"

export default function Movie() {

  const dispatch = useDispatch()

  const movieList = useSelector(state => state.movie.movieList);
  const count = useSelector(state => state.count.count);

  const getMovieList = () => {
    dispatch(getMovieAction())
  }

  return (
    <div>
      <p>count:{count}</p>
      <h3>有个{movieList.length}电影</h3>
      <button onClick={getMovieList}>获取电影信息</button>
      <ul>
        {
          movieList.map(item => {
            return <li key={item.tvId}>{item.albumName}</li>
          })
        }
      </ul>
    </div >
  )
}
